const { resolve } = require('path');
const { PROJECT_PATH } = require('../constant');
const { merge } = require('webpack-merge');
const webpack = require('webpack');
const common = require('./webpack.common.js');
const proxySetting = require('../setProxy.js');
const { SERVER_HOST, SERVER_PORT } = require('../constant');

module.exports = merge(common, {
    mode: 'development',
    devtool: 'eval-source-map',
    target: 'web',
    stats: 'errors-only', // 仅在发生错误时输出
    cache: {
        type: 'filesystem',
        buildDependencies: {
            config: [__filename],
        },
    },
    output: {
        path: resolve(PROJECT_PATH, './dist'),
        publicPath: '/',
    },
    optimization: {
        minimize: false,
        minimizer: [],
        splitChunks: {
            chunks: 'all',
            minSize: 0,
        },
    },
    plugins: [
        // HMR 特性所需要的插件
        // "hot: true" automatically applies HMR plugin, you don't have to add it manually to your webpack configuration.
        // devServer 设置 hot: true 之后可以省略手动配置
        // new webpack.HotModuleReplacementPlugin(),
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify('development'),
        }),
    ],
    devServer: {
        host: SERVER_HOST, // 指定 host，不设置的话默认是 localhost
        port: SERVER_PORT, // 指定端口，默认是8080
        client: {
            logging: 'error', // 浏览器控制台只打印error信息
            progress: true, // 在浏览器中以百分比形式打印编译进度
        },
        compress: true, // 是否启用 gzip 压缩
        open: true, // 打开默认浏览器
        hot: true, // 开启热更新，webpack.HotModuleReplacementPlugin在hot为true时会默认配置，无需手动添加  hot: 'only'
        proxy: { ...proxySetting },
    },
});
